<script lang="ts" setup>
  import type { CustomPaymentInstance } from '@/types/components'
  import { ref } from 'vue'

  const popupRef = ref<UniHelper.UniPopupInstance>()

  const showPopup = () => {
    popupRef.value?.open?.()
  }
  const hidePopup = () => {
    popupRef.value?.close?.()
  }
  const customPaymentRef = ref<CustomPaymentInstance>()
  const openPayment = () => {
    customPaymentRef.value?.open()
  }
</script>

<template>
  <view>
    <button @click="showPopup()">点击弹出</button>

    <uni-popup ref="popupRef" type="bottom">
      弹出内容
      <button @click="hidePopup()">关闭</button>
    </uni-popup>

    <button @click="openPayment">打开支付弹窗</button>
    <custom-payment :order-id="'888'" ref="customPaymentRef" :amount="99"></custom-payment>
  </view>
</template>

<style></style>
